﻿@{
	ViewBag.Title = "人力资源档案登记复核";
}
<script src="~/lib/vue/dist/vue.global.js"></script>
<script src="~/lib/axios/dist/axios.js"></script>
<link href="~/lib/element-plus/dist/index.css" rel="stylesheet" />
<script src="~/lib/element-plus/dist/index.full.js"></script>
<div id="app">

	<table width="90%" cellpadding="5" cellspacing="0" style="margin-bottom:40px">
		<tr>
			<td>
				<font color="black">您正在做的业务是：人力资源--人力资源档案管理--人力资源档案登记复核 </font>
			</td>

		</tr>
		<tr>
			<td><font color="black">当前等待复核的人力资源档案总数：{{totalCount}}例 </font></td>
		</tr>
	</table>
	<div>
		<!-- 表格内容 -->
		<el-table :data="tableData" border style="width: 100%">
			<!-- 表格列 -->
			<el-table-column prop="humanId" label="档案编号"></el-table-column>
			<el-table-column prop="humanName" label="姓名"></el-table-column>
			<el-table-column prop="humanSex" label="性别"></el-table-column>
			<el-table-column prop="firstKindName" label="I级机构"></el-table-column>
			<el-table-column prop="secondKindName" label="II级机构"></el-table-column>
			<el-table-column prop="thirdKindName" label="III级机构"></el-table-column>
			<el-table-column prop="humanProDesignation" label="职称"></el-table-column>
			<el-table-column label="复核">
				<!-- 自定义操作列 -->
				<template #default="scope">
					<el-button link type="primary" size="small" v-on:click="update(scope.row)">复核</el-button>
				</template>
			</el-table-column>
		</el-table>
	</div>
	<!-- 分页 -->
	<el-pagination v-model:current-page="currentPage" v-model:page-size="pageSize" :page-sizes="[2, 4, 6, 8]"
				   :small="small" :disabled="disabled" :background="background"
				   layout="total, sizes, prev, pager, next, jumper" :total="totalCount" v-on:size-change="handleSizeChange"
				   v-on:current-change="handleCurrentChange">
	</el-pagination>
</div>


<script type="text/javascript">
	const { createApp, ref, reactive } = Vue
	var app = createApp({
		setup() {

			let tableData = ref([]);

			let small = ref(false);
			let currentPage = ref(1);
			let pageSize = ref(3);
			let totalCount = ref(0);
			let background = ref(false);
			let disabled = ref(false);

			const handleAvatarSuccess = (res, file) => {
				chargeForm.imageUrl = res.data.url; // Assuming 'res.data.url' is where your image URL is returned
				console.log(res.data.url);
			};

			//信息的收集
			let chargeForm = reactive({
				imageUrl: '',
			})

			const beforeAvatarUpload = async (rawFile) => {
				try {
					let formData = new FormData();
					formData.append('file', rawFile);
					let res = await axios.post('/HF/Upload', formData); // Example endpoint, adjust as per your server setup
					handleAvatarSuccess(res, rawFile);
				} catch (error) {
					console.error('Upload failed:', error);
					ElMessage.error('上传失败，请稍后重试');
					return false;
				}
			};

			//窗体加载分页
			function fill() {
				axios.get('/HF/GetHFFys', {
					params: {
						currentPage: currentPage.value,
						pageSize: pageSize.value,
						HumanFileStatus: "待复核"
					}
				})
					.then(res => {
						console.log(res.data);
						tableData.value = res.data.hFs;
						totalCount.value = res.data.totalCount;
					})
					.catch(err => {
						console.log(err);
					})
			};

			function handleSizeChange(size) {
				pageSize.value = size;
				fill();
			}
			function handleCurrentChange(page) {
				currentPage.value = page;
				fill();
			}

			function update(row, extraNumber) {
				let queryString = '?';
				// 遍历row对象的每个属性，并将其添加到查询字符串中
				for (let key in row) {
					if (row.hasOwnProperty(key)) {
						queryString += encodeURIComponent(key) + '=' + encodeURIComponent(row[key]) + '&';
					}
				}
				// 去除最后一个 '&'
				queryString = queryString.slice(0, -1);
				// 额外添加一个数字到查询字符串
				queryString += '&extraNumber=' + encodeURIComponent(extraNumber); //假设extraNumber是数字或可以被转换为字符串

				//添加一个标识数字
				queryString += '&HFid=1';

				// 构建完整的跳转 URL
				let destination = '/HF/HF2' + queryString;
				// 跳转到新页面
				window.location.href = destination;
			}


			fill();

			return {
				tableData,
				currentPage,
				pageSize,
				small,
				totalCount,
				background,
				disabled,
				fill,
				handleSizeChange,
				handleCurrentChange,
				update,
				chargeForm,
				handleAvatarSuccess,
				beforeAvatarUpload,
			}
		}
	});
	app.use(ElementPlus)
	app.mount('#app')

</script>

<style scoped>

</style>



